<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title>结婚网</title>
		<style>
			*{/*通配符选择器*/
				margin: 0;	
			}
			img{
				vertical-align: bottom;/* 加底线才能对其 */	
			}
			.bd{
				border: 1px solid red;
				/* 边框 */
			}
			.w{
				width: 1080px;
				margin: 0 auto;
			}
		/* 	以下是banner区 */
			.header{
					
			}

			.ad1{
				padding: 15px 0px;	
			}
			.banner{
				padding: 15px 0px 0px 0px;
				height: 555px;
			}
			.fl{
				float: left;/* fl+tab 左浮动 fr + tab 右浮动 */
			}
			.fr{
				float: right;
			}
			.banner_l{
				
			}
			.banner_ad{
				padding-top:15px;
			}
			.banner_ad div:nth-child(2){
				padding: 0 15px;
			}
			/* 以下是main区 */
			
			.title{
			border-bottom: 2px solid #f4f3ef;
			padding-top: 35px;
			/* 内填充 */
			
			}
			

			.title h3{
			font-family: "黑体";
			font-size: 24px;
			line-height: 42px;
			} 
			
			.brand{
				padding-top:  15px;
				height:460px;
			}
			.brand .fl{
				/* width: 259px; */
				padding-right: 15px;
			}

			.brand div:nth-child(4){
				padding-right: 0;
			}
			.style{
				padding-top:  15px;
				height:610px;
			}
			.tupian{
				padding-top:  15px;
			}
			.style1{
				width: 375px;
				height: 610px;
				padding-right: 20px;
			}
			.style2{
				width: 685px;
			}
			.style2 .fl{
				padding-right:15px;
			}
			.fl2{
				padding-top: 15px;
			}	
			.style2 .fl:nth-child(3n){/* 可以是表达式,数字,关键字 */
				padding-right: 0;
			}
			/* 以下是用户晒单（Rrder）1区 */
			.Order{
				height: 83px;
			}
			.title1{
				padding-top: 41px;
				
			}
			.title1 h2{
				font-family: "黑体";
				font-size: 18px;
				line-height: 52px;
				color: red;
			}
			/* 以下是WCelebration区 */
			.WCelebration{
				padding-top: 15px;
			}
			.WCelebration_l{
				padding-right: 29px;
				width: 341px;
			}
			.WCelebration_l_1{
			font-family: "黑体";
			font-size: 18px;
			line-height: 52px;
			color: red;
			}
			.WCelebration_l_2{
				padding-bottom: 16px;
			}
			.WCelebration_r{
				width: 710px;
			}
			.WCelebration_r .fl{
				padding-right: 15px;
			}
			.WCelebration_r .fl1{
				padding-top: 15px;
			}
			.WCelebration_r .fl:nth-child(3n){
				padding-right: 0;
			}
</style>
	</head>
	<body>
		<!-- div*3>img+tab -->
		<div class="header w"><img src="images/case-01.gif" alt=""></div>
		<div class="header w"><img src="images/case-02.gif" alt=""></div>
		<div class="w ad1"><img src="images/case-03.gif" alt=""></div>
		<div class="w"><img src="images/case-04.gif" alt=""></div>
	<!-- 以下是banner区 -->
		<div class="banner w ">
			
			<div class="fl banner_l " > 
			
				<div class="banner_t " ">
				   <img src="images/case-05_1.gif" alt=""  ></div>
				
				<div class="banner_ad ">
						<div class="fl">
							<img src="images/case-05_3.gif" alt="" ></div>
						<div class="fl">
							<img src="images/case-05_4.gif" alt=""></div>
						<div class="fr">
							<img src="images/case-05_5.gif" alt=""></div>
				</div>
				
			</div>
			
			<div class="fr  banner_r " > <img src="images/case-05_2.gif" alt=""></div>
			
		</div>
	<!-- 以下是main区 -->
		<div class=" w ">
			
			<div class="title">
					<h3>品牌</h3>
			</div>
			
			<div class="brand">
				<div class="fl"><img src="images/case-07_1.gif " alt=""></div>
				<div class="fl"><img src="images/case-07_2.gif" alt=""></div>	
				<div class="fl"><img src="images/case-07_3.gif" alt=""></div>
				<div class="fl"><img src="images/case-07_4.gif" alt=""></div>
			</div>
			
			<div class="title">
				<h3>风格</h3>
			</div>
			
			<div class="style">
				
				<div class="fl style1 ">
					<div><img src="images/case-09_1.gif" alt=""></div>
					<div class="tupian"><img src="images/case-09_8.gif" alt=""></div>
				</div>
				
				<div class="fl style2">
					<div class="fl "><img src="images/case-09_2.gif" alt=""></div>
					<div class="fl "><img src="images/case-09_3.gif" alt=""></div>
					<div class="fl "><img src="images/case-09_4.gif" alt=""></div>
					<div class="fl fl2"><img src="images/case-09_5.gif" alt=""></div>
					<div class="fl fl2"><img src="images/case-09_6.gif" alt=""></div>
					<div class="fl fl2"><img src="images/case-09_7.gif" alt=""></div>
					<div class="fl fl2"><img src="images/case-09_9.gif" alt=""></div>
					<div class="fl fl2"><img src="images/case-09_10.gif" alt=""></div>
					<div class="fl fl2"><img src="images/case-09_11.gif" alt=""></div>
				</div>
				
			</div>
		
		</div>
	<!--以下是用户晒单Order区-->	
		<div class="w ">	
		<div class="title1 ">
			<h2 >用户晒单</h2>
		</div>
		<div class="w Order">
			<div class="fl"><img src="images/case-11_60.gif" alt=""></div>
			<div class="fl"><img src="images/case-11_61.gif" alt=""></div>
			<div class="fl"><img src="images/case-11_62.gif" alt=""></div>
			<div class="fl"><img src="images/case-11_63.gif" alt=""></div>
			<div class="fl"><img src="images/case-11_64.gif" alt=""></div>
			<div class="fl"><img src="images/case-11_65.gif" alt=""></div>
		</div>	
		</div>	
	<!--以下是WCelebration区-->	
	<div class="w">
		<div class="title">
					<h3>婚庆</h3>
		</div>
		<div class="WCelebration">
			
			
			
			<div class="fl WCelebration_l">
				<div ><img src="images/case-13_1.gif" alt=""></div>
				<div class=""><img src="images/case-13_5.gif" alt=""></div>
				<h2 class="WCelebration_l_1">用户晒单</h2>
				<div class="WCelebration_l_2"><img src="images/case-13_7.gif" alt=""></div>
				<div><img src="images/case-13_8.gif" alt=""></div>
			</div>
			<div class="fl WCelebration_r">
				<div class="fl"><img src="images/case-13_2.gif" alt=""></div>
				<div class="fl"><img src="images/case-13_3.gif" alt=""></div>
				<div class="fl"><img src="images/case-13_4.gif" alt=""></div>
				<div class="fl fl1"><img src="images/case-13_9.gif" alt=""></div>
				<div class="fl fl1"><img src="images/case-13_10.gif" alt=""></div>
				<div class="fl fl1"><img src="images/case-13_11.gif" alt=""></div>
			</div>
		</div>
	</div>
	<!-- 最后 -->
	<div class="w"><img src="images/case-14.gif" alt=""></div>
	</body>
</html>
